const staff_event_index = {
    template:`
<div>
                        <div class="d-flex justify-content-between flex-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                            <h1 class="h2">Event List</h1>
                            <div class="btn-toolbar mb-2 mb-md-0">
                                <div class="btn-group mr-2">
                                    <router-link :to="{name:'staff.event.create'}" class="btn btn-sm btn-outline-primary">Create new event</router-link>
                                </div>
                            </div>
                        </div>
                        <div class="row mt-4">
                            <div class="col-md-3 text-primary" v-for="(item,index) in events" :key="index">
                                <div class="card mb-4 shadow-sm private-event">
                                    <router-link :to="{name:'staff.event.detail',params:{event_id:item.id}}" class="btn text-left">
                                        <div class="d-flex justify-content-between">
                                            <h5 class="card-title">{{item.name}}</h5>
                                            <span class="card-subtitle text-uppercase">{{item.code}}</span>
                                        </div>
                                        <div class="d-flex justify-content-between">
                                            <span class="card-subtitle">{{item.date}}</span>
                                            <span class="card-permission">{{item.permission}}</span>
                                        </div>
                                        <hr>
                                        <p class="card-text">{{item.address}}</p>
                                    </router-link>
                                </div>
                            </div>
                        </div>
                    </div>    
    `,
    data() {
        return {
            events:null,
        };
    },
    methods:{
        get_events() {
            ajax.get('event').then(res=>{
                if (res.status === 200){
                    this.events = res.data.data;
                }
            })
        }
    },
    mounted() {
        this.get_events();
    }
}